<template>
	<view v-if="load" >
		<view v-if="list.length > 0">
			<view class="order-top-line" ></view>
			<view class="order-card" v-for="(item,index) in list" :key="'list'+index" >
				<view class="order-card-title">{{item.bx_name}}</view>
				<view class="order-card-center">
					<view class="order-card-center-item" >
						<view class="order-card-center-title">生效日期</view>
						<view class="order-card-center-time">{{item.start_time}}</view>
					</view>
					<view class="order-card-center-item" >
						<view class="order-card-center-title">结束日期</view>
						<view class="order-card-center-time">{{item.end_time}}</view>
					</view>
					
				</view>
				<view class="order-card-footer" @tap="toPay(item.id)" >去支付</view>
				<view class="order-card-tag" >待支付</view>
			</view>
		</view>
		<view v-else class="empty-box" >
			<image src="https://jy-yyzj.oss-cn-shanghai.aliyuncs.com/jdbx/h5/order1.png" mode="widthFix" class="empty-icon"></image>
			<view class="empty-txt" >还没有待支付订单</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return {
				list :[],
				page : 1,
				last_page :1,
				load : false
			}
		},
		onLoad() {
			this.getData();
		},
		onReachBottom() {
			if(this.page >= this.last_page)return this.toast('暂无更多数据');
			this.page ++;
			this.getData();
		},
		methods:{
			toPay(id){
				uni.navigateTo({
					url:'/pages/bx/confirm?id='+id
				})
			},
			getData(){
				this.ajax('user/orderList',{
					data:{
						state : 1,
						page : this.page
					},
					success:(res) => {
						this.load = true;
						this.page = res.msg.current_page;
						this.last_page = res.msg.last_page;
						if(this.page == 1) {
							this.list = res.msg.data;
						} else {
							this.list = this.list.concat(res.msg.data);
						}
					}
				});
			}
		}
	}
</script>

<style>
	@import url("@/static/css/order/list.css");
</style>
